
import React from 'react'
import ReactDOM from "react-dom";
import Header from 'components/header'
import Footer from 'components/footer'
import Content from 'components/content'
import 'assets/css/global.css'

class Home extends  React.Component{
	constructor(props){
		
		super(props)	
		
		this.state = {
			valueButton:''
		}
		this.Button=this.Button.bind(this);
	}
	
	Button(hrefLink){
		this.setState({valueButton:hrefLink});
	}
	
	componentDidMount(){
		
		const video = document.querySelector(".Video");
		
		video.play();
		
		video.addEventListener('ended',()=>{
			return document.querySelector(".media").remove();
		})
		
	}
	
	render(){
		return(
			<div>
				<Header />
				<Content Button={this.Button} 
					     valueButton={this.state.valueButton}/>
				<Footer valueButton={this.state.valueButton} 
						Button={this.Button}/>
				<div className="wave"></div>
				<div className="media">
					<video className="Video" src='./app/0.mp4' autoplay="autoplay"   >
					</video>
				</div>
				
			</div>
		)		
	}
}

ReactDOM.render(<Home />, document.querySelector("#app"));
